import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react';

import {
  Button,
  DatePicker,
  Form,
  Input,
  Modal,
  Radio,
  Tag,
  Select,
  InputNumber,
  message,
  Row,
  Col,
} from 'antd';
import { modalLayoutLg, modalLayoutMd, modalLayoutSm } from '@/config/layout';
import { request } from 'umi';
import IndustryRacetrackCom from '@/components/industryRacetrack'
const DictModal = (props: any, refs: any) => {
  const [form] = Form.useForm();
  // const [fileList,setfileList] = useState([]);
  const [measureClassData, setmeasureClassData] = useState([]);
  const { setFieldsValue, resetFields } = form;

  const [code, setCode] = useState('');
  const [isModalVisible, setIsModalVisible] = useState(false);
  const { TextArea } = Input;
  const [industryIds, setindustryIds] = useState(['1731855992284512258', '1731856015156051969', '1731856034848309249']);
  const [racetrackIds, setracetrackIds] = useState(['1731856180340326401', '1731856159654019074', '1731856247147200513', '1731856219179581441']);

  // const [industryIds, setindustryIds] = useState([]);
  // const [racetrackIds, setracetrackIds] = useState([]);
  //显示弹窗
  const showModal = () => {
    setIsModalVisible(true);
  };

  //取消
  const handleCancel = () => {
    setIsModalVisible(false);
    setCode('');
    resetFields();
    props.callback && props.callback();
  };
  //确定
  const handleOk = () => {
    console.log('industryIds');
    console.log(industryIds);
    console.log('racetrackIds');
    console.log(racetrackIds);
  };

  const getDetail = (id: any) => {
    request('/sys/dict/queryById?id=' + id, {
      method: 'GET',
      headers: {
        'Content-Type': 'application/json',
      },
      data: {
        id,
      },
    }).then((res) => {
      setFieldsValue(res?.data);
      showModal();
    });
  };
  useImperativeHandle(refs, () => ({
    init: (id: any, record: any) => {
      if (id) {
        setCode(id);
        getDetail(id);
      } else {
        resetFields();
        showModal();

      }

      // setfileList([]);
    },
  }));

  return (
    <Modal
      title={code === '' ? '新增' : '编辑'}
      visible={isModalVisible}
      onOk={handleOk}
      onCancel={handleCancel}
      centered
      width={600}
      maskClosable={false}
      bodyStyle={{
        maxHeight: window.innerHeight - 150,
        overflowY: 'auto',
      }}
    >
      <Form form={form} {...modalLayoutMd}>
        <Form.Item
          label="领域"
          name="industryId"
          rules={[{ required: true, message: '请选择领域!' }]}
        >
          <IndustryRacetrackCom
            industryIds={industryIds}
            racetrackIds={racetrackIds}
            url='/sys/dictUtils/findIndustryList'
            callBack={(rdata) => {
              setindustryIds(rdata?.industryIds || [])
              setracetrackIds(rdata?.racetrackIds || [])
            }} />
        </Form.Item>
      </Form>
    </Modal>
  );
};
const AddMCom = forwardRef(DictModal);

export default AddMCom;
